<!doctype html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<title>手势锁屏示例</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<!--标准mui.css-->
		<link rel="stylesheet" href="../../css/mui.min.css">
		<link rel="stylesheet" href="locker.css">
	</head>

	<body>
		<header class="mui-bar mui-bar-nav title-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left mui-back-new"></a>
			<h1 class="mui-title mhd-title">设置手势密码</h1>
		</header>
		<div class="mui-content" style="margin:0px;padding:0px;background-color:#085BB4;">
			<div id='holder' class="mui-locker" style="border:0px;background-color:#085BB4;margin-top:140px;"
				data-locker-options='{"ringColor":"rgba(210,210,210,1)","fillColor":"","pointColor":"rgba(5,97,196,1)","lineColor":"rgba(255,255,255,1)"}'>
			</div>
			
			<div style="background-color:#085BB4;text-align:center; color:white; margin-top:40px;">
				<span>手势密码将在您开启程序时启动</span>
			</div>
		</div>

		<script type="text/javascript" src="../../js/jquery-2.1.1.min.js"></script>
		<script type="text/javascript" src="../../js/cmw_core.js"></script>
		<script type="text/javascript" src="../../js/constant.js"></script>
		<script type="text/javascript" src="../../js/global.js"></script>
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/app.js"></script>
		<script src="../../js/mui.locker.js"></script>
		<script>
			(function($, doc) {
			$.plusReady(function() {
				var settings = app.getSettings();
				var locker = doc.querySelector('.mui-locker');
				
				//locker.style.display = settings.gestures ? 'block' : 'none';
				var record = [];
				locker.addEventListener('done', function(event) {
					var rs = event.detail;
					if (rs.points.length < 4) {
						plus.nativeUI.toast('设定的手势太简单了');
						record = [];
						rs.sender.clear();
						return;
					}
					record.push(rs.points.join(''));
					if (record.length >= 2) {
						if (record[0] == record[1]) {
							var userId = plus.storage.getItem(KeyCfg.userId);
							var url = UrlConfig.set_lockpassword;
							MuiEventMgr.ajax(url,{pars:{id:userId,gestures:record[0]},
								sfn:function(data){
									if(data.success){
										plus.nativeUI.toast('解锁手势设定成功，以后用户只需使用手势解锁而无需输入密码登录。');
										settings.gestures = record[0];
										settings.autoLogin = true;
										var date = new Date();
										settings.overTime = date.getTime();
										app.setSettings(settings);
										setTimeout(function() {
											$.back();
										}, 200);
									}else{
										mui.alert(data.msg);
									}
								},ffn:function(err){
									mui.alert('设置失败！');
								}
							});
						} else {
							plus.nativeUI.toast('两次手势不一致,请重新设定');
						}
						rs.sender.clear();
						record = [];
					} else {
						plus.nativeUI.toast('请确认手势设定');
						rs.sender.clear();
					}
				}, false);
			});
		}(mui, document));
		</script>
	</body>
</html>